<template>
  <div class="user-setting">
    <van-nav-bar title="个人信息" left-arrow @click-left="backUp"></van-nav-bar>
    <van-cell-group>
      <van-cell icon="user-o" title="修改昵称" is-link :to="{path: '/nicknamechange'}" />
      <van-cell icon="closed-eye" title="修改密码" is-link :to="{path: '/pwdchange'}" />
      <!-- <van-cell icon="phone-o" title="更换手机号" is-link :to="{path: '/phonechange'}" /> -->
    </van-cell-group>
  </div>
</template>
<script>
import {
  NavBar,
  Cell,
  CellGroup,
  Collapse,
  CollapseItem,
  Uploader
} from "vant";
export default {
  components: {
    [NavBar.name]: NavBar,
    [CellGroup.name]: CellGroup,
    [Cell.name]: Cell,
    [Collapse.name]: Collapse,
    [CollapseItem.name]: CollapseItem,
    [Uploader.name]: Uploader
  },
  data() {
    return {
      activeNames: ["1"]
    };
  },
  methods: {
    backUp() {
      this.$router.go(-1);
    },
    onRead(file) {
      console.log(file);
    }
  }
};
</script>
<style lang="less" scoped>
@import "~style/common.less";
@import "~style/order.less";

.user-setting {
  background-color: @borderColor;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.van-button {
  transform: translateY(100px);
}
.van-cell {
  color: @priColor;

  &__title {
    color: @fontColorP;
    text-indent: 0.5em;
    // border: 1px solid #111;
    .font-dpr(14px);
  }
  .van-uploader {
    margin-left: -0.5em;
    position: relative;
    left: -0.5em;
    p {
      position: absolute;
      border: 1px solid red;
      z-index: 999;
      left: 1em;
      top: 0;
      color: @fontColorP;
      .font-dpr(14px);
    }
  }
}
</style>